import React ,{useState} from 'react'
import { Outlet ,useNavigate} from 'react-router-dom'
import type { MenuProps } from 'antd';
import { Menu } from 'antd';

const items: MenuProps['items'] = [
  {
    label: '首页',
    key: '/index/shou',
  },
  {
    label: '社区',
    key: '/index/car',
  },
  {
    label: '云服务',
    key: '/index/shop',
  },
  {
    label: '个人中心',
    key: '/index/my',
  },
];
export default function Index() {
  const navigate = useNavigate()
  
    const [current, setCurrent] = useState('/index/shou');
  const onClick: MenuProps['onClick'] = e => {
      
      navigate(e.key)

      setCurrent(e.key);
    };
  return (
    <div>
     <Menu onClick={onClick} selectedKeys={[current]} mode="horizontal" items={items} />
        <Outlet></Outlet>
   
    </div>
  )
}
